import React, { Component } from 'react';
import { Text, View, Modal, StyleSheet } from 'react-native';
import { GLOBAL } from '../config/global';

const scale = GLOBAL.SCALE;
export class ListDailogModal extends Component {
	static props = {
	}

	constructor(props) {
		super(props);
		this.state = {
		};
	}

	render () {
		console.log('this.props---', this.props);

		return (
			<View style={{ flex: 1 }}>
				<Modal
					transparent={true}
					visible={this.state.isVisible}
					animationType={'fade'}
					onRequestClose={() => {
						this.setState({
							ModalVisible: true
						})
					}}>

					{this.renderModal()}

				</Modal>
			</View>
		);
	}

	renderModal () {

		return (
			<View style={styles.container}>
				<Text style={styles.backgroundView} onPress={() => {
					this.props.dimissModal();
				}}>
				</Text>
				<View style={styles.listView}>
					<View style={styles.itemView}>
						<Text style={[text, { fontSize: 12 * scale, color: '#8B8B8B' }]}>收藏</Text>
					</View>
					<View style={styles.itemView}>
						<Text style={styles.text} onPress={() => { this.props.removeCollect() }}>移除</Text>
					</View>
					<View style={styles.itemView}>
						<Text style={styles.text} onPress={() => {
							this.props.setTop();
						}}>{this.props.showIndex === 1 ? '取消置顶' : '置顶'}</Text>
					</View>
				</View>
			</View >
		)
	}

	componentWillMount () {

	}

}

const styles = StyleSheet.create({
	container: {
		flex: 1,
		position: 'absolute',
		height: '100%',
		width: '100%',
		top: 0,
		zIndex: 99
	},
	backgroundView: {
		position: 'absolute',
		backgroundColor: '#000',
		width: '100%',
		height: '100%',
		opacity: 0.3,
	},
	listView: {
		flexDirection: 'column',
		alignItems: 'flex-start',
		backgroundColor: '#fff',
		width: '76%',
		marginTop: '50%',
		marginLeft: '12%',
		paddingBottom: 17 * scale,
		paddingLeft: 27 * scale,
		borderRadius: 13 * scale,
	},
	itemView: {
		flex: 1,
		marginBottom: 26 * scale,
	},
	text: {
		fontSize: 13 * scale,
		color: '#404040',
		paddingTop: 14 * scale,
		paddingBottom: 17 * scale,
	}
})